<template>
    <div>
         <van-nav-bar title="春雨医生" left-text="" left-arrow @click="onClickLeft" />
        <div class="title">
            <div>
                <h3 style="font-weight: 900;font-size: 18px;margin-left: 25px;margin-top: 10px;">缓解肩颈疲劳酸痛</h3>
            </div>
            <div>
                <img src="../../assets//menss.jpg" alt="" style="width: 260px;height: 70px;margin-left: 12px;">
            </div>
            <div class="tiao" @click="Toindex">
                <p>8天健康养成计划</p> <span>进入计划目录</span>
            </div>
            <div>
                      <video src="../../assets//黄霄雲 - 星辰大海(2022河南卫视“青春万岁”五四青年节特别节目).mkv" controls autoplay  class="video"></video>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref } from 'vue';
const  list=ref<any>([])
import { useRouter, useRoute } from "vue-router";
const router = useRouter();
const slicedData = ref(list.value.slice(1, 20));
console.log(slicedData.value);

const Toindex=()=>{
    router.push({path:'/cultivation'})
}
const onClickLeft = () => history.back()
    const  getlist=async()=>{
        await axios.get('/Todetail/goodVideo').then(res=>{
            console.log(res)
            list.value=res.data.data
            console.log(list.value)
        }).catch(err=>{
            console.log(err)
        })
    }
    getlist()
</script>

<style lang="scss" scoped>
    .title{
        width: 100%;
        height: 1000px;
        background-color: #ffff;
    }
    .tiao{
        width: 95%;
        height: 70px;
        background-color: #f4f6f7;
        position: relative;
        p{
            line-height: 70px;
            margin-left: 18px;
            font-size: 18px;
             position: absolute;
        }
        span{
            line-height: 70px;
            right: 30px;
            position: absolute;
        }
    }
    .video{
        width: 375px;
    }
</style>